// DOM元素
const loginForm = document.getElementById('loginForm');
const registerForm = document.getElementById('registerForm');
const loginCard = document.querySelector('.login-card');
const registerCard = document.querySelector('.register-card');
const showRegisterBtn = document.getElementById('showRegister');
const showLoginBtn = document.getElementById('showLogin');
const messageBox = document.getElementById('messageBox');
const togglePasswordBtns = document.querySelectorAll('.toggle-password');

// 显示消息提示
function showMessage(text, type = 'error') {
    messageBox.textContent = text;
    messageBox.className = 'message-box';
    messageBox.classList.add(type);
    messageBox.classList.remove('hidden');

    // 3秒后自动隐藏
    setTimeout(() => {
        messageBox.classList.add('hidden');
    }, 3000);
}

// 切换密码可见性
togglePasswordBtns.forEach(btn => {
    btn.addEventListener('click', function() {
        const input = this.parentElement.querySelector('input');
        const icon = this.querySelector('i');

        if (input.type === 'password') {
            input.type = 'text';
            icon.classList.remove('fa-eye');
            icon.classList.add('fa-eye-slash');
        } else {
            input.type = 'password';
            icon.classList.remove('fa-eye-slash');
            icon.classList.add('fa-eye');
        }
    });
});

// 切换到注册表单
showRegisterBtn.addEventListener('click', function(e) {
    e.preventDefault();
    loginCard.classList.add('hidden');
    registerCard.classList.remove('hidden');
});

// 切换到登录表单
showLoginBtn.addEventListener('click', function(e) {
    e.preventDefault();
    registerCard.classList.add('hidden');
    loginCard.classList.remove('hidden');
});

// 登录表单提交处理
loginForm.addEventListener('submit', async function(e) {
    e.preventDefault();

    const username = document.getElementById('username').value;
    const password = document.getElementById('password').value;

    // 简单验证
    if (!username || !password) {
        showMessage('请输入用户名和密码');
        return;
    }

    try {
        // 显示登录中状态
        showMessage('登录中...', 'success');

        // 调用后端登录接口
        const response = await fetch('/webuser/login', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
            },
            body: `userId=${encodeURIComponent(username)}&password=${encodeURIComponent(password)}`
        });

        const result = await response.text();

        if (result === '登录成功') { // 假设后端返回"登录成功"表示验证通过
            showMessage('登录成功！正在进入游戏...', 'success');
            // 2秒后跳转到游戏主页
            setTimeout(() => {
                window.location.href = 'game.html';
            }, 2000);
        } else {
            showMessage(result || '登录失败，请检查用户名和密码');
        }
    } catch (error) {
        showMessage('网络错误，登录失败');
        console.error('登录请求失败:', error);
    }
});
// 注册表单提交处理
registerForm.addEventListener('submit', async function(e) {
    e.preventDefault();

    const username = document.getElementById('regUsername').value;
    const password = document.getElementById('regPassword').value;

    // 简单验证
    if (!username || !password) {
        showMessage('请填写所有字段');
        return;
    }

    // 密码长度验证
    if (password.length < 6) {
        showMessage('密码长度至少为6位');
        return;
    }

    try {
        // 显示注册中状态
        showMessage('注册中...', 'success');

        // 调用后端注册接口
        const response = await fetch('/webuser/register', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
            },
            body: `userId=${encodeURIComponent(username)}&password=${encodeURIComponent(password)}`
        });

        const result = await response.text();

        if (result === '注册成功') { // 假设后端返回"注册成功"表示注册成功
            showMessage('注册成功，即将跳转到登录页面...', 'success');
            // 切换到登录表单
            setTimeout(() => {
                registerCard.classList.add('hidden');
                loginCard.classList.remove('hidden');
                registerForm.reset();
            }, 1500);
        } else {
            showMessage(result || '注册失败');
        }
    } catch (error) {
        showMessage('网络错误，注册失败');
        console.error('注册请求失败:', error);
    }
});

// 添加页面载入动画
window.addEventListener('load', function() {
    document.body.classList.add('loaded');
});